<template>
  <div >
    <h1 v-text="msg"></h1>
    <h2>学生姓名：{{name}}</h2>
    <h2>学生性别：{{sex}}</h2>
    <!-- 数值类型的age才能实现加分运算 -->
    <h2>学生年龄：{{myAge+1}}</h2>
    <button @click="addAge">尝试修改学生年龄</button>
  </div>
</template>

<script>


export default {
    name:'Student',
    data() {
        console.log('@',this);
        return {
            // name:'彼暗 ',
            // sex:'男 ',
            // age:18,
            msg:'一剑🗡开天门',
            // 会优先加载props
            myAge:this.age,
        }
    },
    // 简单声明接收
    props:['name','sex','age'] ,
    methods: {
      addAge(){
        this.myAge ++
      }
    }, 


    // 接收的同时对数据进行类型限制
    /* props:{
        name:String,
        age:Number,
        sex:String
    }, */


    // 接收的同时对数据：进行类型限制+默认值的指定+必要性的限制
    /* props:{
      name:{
        type:String,  // name的类型是字符串
        request:true, // name是必要的
      },
      age:{
        type:Number, // age的类型是Number
        default:99 , // 默认值为99 
      },
      sex:{
        type:String, 
        request:true , 
      }
    } */

}
</script>
